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HTML in Hindi f g* * • * t in * 

D Introduction to HTML in Hindi 

D Versions of HTML in Hindi 
D Introduction to HTML tags in Hindi 
Qi Basic tags of HTML In Hindi 
Q < DOCTYPE> tag in Hindi 
D Executing HTML program in Hindi 


Introduction to HTML 

HTML tTF Hyper Text Markup Language $\ ^ web pages create 3R^^ R3T 
3TTHF t\ HTML Berners lee ^ 1991 # create *PfT *Jtl 3fTf^T FF<^ HTML 3F 

JTHoR 3FT FRTTT RR^ - tjtl HTML full form HyperText Markup Language |TI 

FT word ^Ft detail TOT^TRTT 3TT T^T ^"1 

Hyper 

Hyper 3T HHRR FtHT t ^t HTML sequence # 3TTT 3Rc?T £l ^FT ftRfr programming 
language # FtHT $ f i 7W; statement RTF 3R TW statement execute FRTT1 HTML file 

# link ^ 3ftT ^J3TT 3TT FT press 4Rdl £ eft execute ft 3iTcfr §1 FFR F>#r 

f^riffi elements 3^ RT Rt TTSfT load gu ^ RT H^tl 3fT ^1" ftRft HTML 

file ^ FF^T SJJTfir HTML file execute 5f^t Ft FFRfr ?TI R3fT HTML files independent FF?T §"1 


Text 

HTML text ^t format FR^F webpages ^ W#T represent FR^T ^ f?TF R*r 3TTrfT §l 

Markup 

Markup FT iRToR text formatting FtcTT §1 3TTF text FFT tags <^ui mark FRH |tl text 
FT t tags c^HI mark fti±ll 3TTHT F ft text web page # show ftHt f\ 3TTF 

ftRfr text F>t < h 1 > tag f^TIsfat cfr webpage page FT FF - text srsr 3ttl bold ^RTTI 

Language 

HTML UFT language 3fr web development f^TF 3TTcfr §"| 


HTML versions 

3RT HFF HTML FFTT Tt version industry #T 3TT |T fsrtr Fit # rfttr f^RT 3fT TFH" §TI 


HTML 1.0 
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3|- HTML ^F T version aJTI 3W WW aiW awr afTT ?w language ^ art # iri 3ftT 

HTML stT a^H - limited *ftl 

HTML 2.0 

fTT version # HTML 1.0 ^ ^T3lT features sfl fTT version ^ TTRT HTML website develop 

aRir ar ^^rarT^r afri 

HTML 3.0 

fW version ^ 3TT^T wf HTML popular ^ afti fw version # browsers w®r 
compatibility problem a3T|T ^ version aft Ttar f^W war airi 


HTML 3.2 

^FT version # version #r axr tags add f^T wi ir time air W3C 

3^ website development ^ HTML aff standard Ulf^d fTTT ajri 

HTML 4.01 

fW version # arr STU tags WW cascading style sheet art afr introduce f^FW WW arri 
fW TPT3T HTML BPjt FRF modern language a3=T -ej«Pl aft| 

HTML 5.0 

HTML aR latest version Jl fTif multimedia support ^ f^nr a?U 5T7 tags provide i^h4 
WT Jti 

XHTML 

version HTML 4.01 ^ aTF 3TRIT *JTI HTML ^ war XML sfT add f^WT W3JT Wl 

HTML tags 

tRF HTML file tags 3frr text ar combination ftcft £l 3TTWFt tags ar concept TTTpT 3TT 
wit at 3TTR HTML 3TTWrfT sMd^ WFFT £| Basically tag if text war wm aRW £\ 

irar tag specific purpose define aRHT t\ FT task f£nr 3 FFRT 3TFRT tags 4dl^ w §1 
f^Rft aft tag % 2 part ^tct ffll Opening tag ?rT3TTrT # TPT 3TT7TT ft I fTRf interpreter Tf if BHT 
TFT war 4>i 3i I h a-^-ii #>^<4 arif j^i Opening tag aTF at text ItTot 3nar ijt FSla '■k if tag 
apply ft WT §1 fT^ aTF closing tag f^TUT dldl §"1 Closing tag ^ interpreter aft TTT 4ddl §" 
#T fT tag ar 3 m4ni a*5t ht TTI Closing tag aft opening tag ^ differentiate 
closing tag ^f forward slash dJilill 3TTHT §"lTags ^FT basic structure fiWT 3TT ^ |T| 


<tagName> text </tagrslam]e> 


Some basic tags 

f^T JfTWl HTML #r W basic tags fer 3TT |tl at tags |t 3Tt atFT fTT HTML file if 
commonly 3j3f a^Ttl 
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Tag 

Explanation 

< html > </html> 

Sfr HTML file 9TT3TTH tag ^ 3TTc?T tag S^ftcTT 

t ^ ^ file HTML file ^1 «iiPh TF3tT tags fTT tag JJcFT 

3TTc^ £ 1 t tag program # TT^T 3 uksk # close 3TTHT |T| 

<headx/head> 

tag # document # information ^tcfr |F| HRT 

aiiiH<w web page script apply |t Hf §fT tag 

3F^T define ftl tag HTML tag 3TCTT STTcTT ftl 

<title> 

fTT tag e^Ki web page title display 3TTHT !£| ^F tag 

</title> 

head tag ^ 3T^T 3FIHT ftl 

< body x/ body > 

3TF 3fr text body tag # ffrcfT ^ program ^ interpret #T 

display ^F criidl §"1 tag head tag close STT5T 

# 3TTHT ftl 
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A simple HTML program 
<html> 

<head> 

<title>My Page</title> 
</head> 

<body> 

<hl> 

My First Web Page 
</hl> 

</body> 

</html> 


<!DOGTYPE> tag 

^TT HTML tag q^T tag SRT f^TT 3TTHT £l tag ddldl ft 3TFT 4>1ddl HTML 

version browsers security purpose HTML #r versions 

support sift q=TrT |TI ^R^nr it tag HTML version #■ browser information ^HT 

rSvHFl browsers appropriate action vt RT^I 

Executing HTML program 

HTML program execute 4d<HI ^gcT ft 3TTRFT §"1 T^T q^ 3TFT 3TT^ program ^Ff text 
editor # f^nir cSIRijTi notepad atrial 
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«TTST 3TT program ^Ft .html extension ^ ^TT^T save l 


^vh4-> <m id; 3 h i h 3TT save *i -41 file 44 open 4->< 4 5^1 


3hh4>i webpage browser # automatically open ffT 3nHT §"1 
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HTML tags and attributes 

Q Some more common HTML tags in Hindi 
©Introduction to HTML Attributes in Hindi 
B Example of HTML attributes in Hindi 
Q Scope of attributes with HTML in Hindi 
©Guide lines for using HTML attributes in Hindi 
©Common HTML attributes in Hindi 


Some more common HTML tags 

Attributes £r 3ttR common tags f^TT 3TT Rgr Sti tags 

«hl ^-cld-lloH 3i M 3-1 M =II<HI examples f^F^TT 3TT^Tfn 


<hl> </hl> 

heading tag fftHT §"1 page heading define 

^ STPT fi^Hl paragraph # ft 3ftR 3RT4?r heading 

define RRT ^"1 5^=0 text size ^ page # large ^tr?T ^1 

<h2> </h2> 

rfT heading tag ^tcTT §"l <hi"Wi text size <hl> tag 

^trfT |tl ^ heading ^ subheading declare f^PJ ^J3T 

3TTHT t^"l 

<h3> </h3> 

it §fT heading tag ^trTT 5^1 subheading minor heading 

declare % f?PT 3TIHT §1 ^h*G1 text size sub heading 

^heHl ■fCl <— Tl ^"| 

<p> </p> 

it paragraph tag ^ftcFT §1 SfTRT 3??? paragraph 3TR^T page 

# f^RsT ^H«hri |t 3ft? 3RT^f different attributes #T c^ki position 
^H^hrl §"l ftRlt paragraph RT «^lcTl TTSft formatting 3TTT 

tag % attributes S^RT tl 

</ br> 

tag line break % fottT 3J3T 3TTHT §"1 tag % 

^FT text ^frfr line # # tfHT tl 


8 


Introduction to HTML attributes 

sfT HTML tags 3R attributes |tl # name 3#T value ^ pair # fcn^ ^ic\ 

|tl Attributes % d^KI JTFT tags RT according configure ^fR -H=brl §"l Attributes RT 
starting tag R define f^RIT 3TTHT Jh define sfrR 3^1 i^ui sft^T fc^RT" 3TT T?T mi 


<tagNaine attrMame= ,, value" > 
some text here. 

</tagName> 


Attributes advanced configuration ^ f^DT f%Rt 3TTrT S'! 4Ff 3TFT default page 
background Rl£t rft 3RRtr strR according change ^fR RR^cT ^1 STIR Rflr default 

text color -Ul^rl 8" eft 3TT Rt change ^R RRrT t=T| Attributes Rf R3T ^RSTF -=igd simple |f| 
RR 3TFT^r RrTT £tRT RTf^R attribute f%RT 3RTR 3J3T rrrt ?tl 3fT^t attributes Tt related 

I FRF simple 3^TW HfRT 3TT TfTT |tl 


chtrml > 

< head> 

<title>myPage< /title> 

</head > 

<body bgcoloir=" black ' 1 > 

<hl style="color : pink" > Heading </hl> 

<p style= "color : yellow” > 

This is a paragraph. And you are learning htrnl in Hindi. 

</p> 

</body> 

</html> 


3RT ficir T example # 2 attributes vn 7 ft! RR^r < body> tag # bgcolor 

attribute RR^ - ^IT page RTF background color define f^RTT RRT fh 3TR 3TPT default body 
tag RR ft Rf page RR background color white <$<-u gd ^RT STFR^t RcTTRT #T 

aTTR attributes ^ AdKI page 3ftr text STTR 3TR^T according configure RR" R«hc1 |fl ^R 
attribute «F 2[RRT 3H i h 3ft backg rou nd 3T T To% page «t>i RURT ^n^rl Rl" R9" RR^" ^"1 4^1 j-I«A 

example R black f^RT Jfi 

d±$U\ attribute paragraph tag R 3j^r f^FRT RRT §"l R style attribute |tl ?R attribute ^F <dlll 
STTR tag RT CSS (Cascading Style Sheet) apply RR RRR^T §1 CSS 5^RKT advanced 
configuration f^FRT 3TTHT f^RT#r rR # 3TTR 3TRt Jli I 3t£r aTTR ^0" RR^T style attribute 
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3" c R fSjr example # 2 3RT^ attributes ^FFT f^$T gt! TRnfr *T^F < body> tag # bgcolor 
attribute 2J3F *Mcl gtr page ^ft background color define f^M\ ^RTT Jf| 3T*r 3TFF default body 
tag «Mc1 t rfr page ^FT background color white T?cTF §1 ^f^d ^t^TT 3TFT3FT ^dl'MI ^FT 

3TT*T attributes ^F £^RF page 3? tr text STT’T according configure 3FT |t| fFF 

attribute ^F 25 ^ 1 RF 3i i h 3Tf background 3f c T3% page °h:i ^^drii ^i^cl ^T" RIF 'H e bd t?"l 
example black f^-MI $\ 

^JTTT attribute paragraph tag # f^FZTT ^TUF t\ ^ style attribute $\ attribute ^F <^=IKI 
3TT T T tag 'TT CSS (Cascading Style Sheet) apply ^FT g-| CSS ^f <ykl advanced 

configuration Oh -Ml 3TTHT Jf, f^RT^F WTT # aTT^T 3FRt I ^F 3 TFT ^*Hrl g" style attribute 
d^dKI CSS apply ^RTF gd text 3FF color change f*FRFT 3TTHT gd 3itT fRtf gV heading 
tag gF tttst aft f^FRJF totf gd 


Scope of attributes 

Attributes ^FT scope Jd4> tags 3 f according gtHF gd f^RT tag gF qTFar JFFT 3fr attribute apply 
=Mcl g gf 3Tfr tag FFF ^dl gl 3H I body tag style tag 3FT qj3T 3RcT gFT text color 

red define T^rur 8"! Body tag ^ page gF f^nr gtcir g # attribute gg page gF text ^fT 

red # show «hidl I <?}PFd ^FTT FW FRF gt gRTF 3RF cRF 3FT# body tag tSteT tag text ^FT 

color # define dgf *+Udl gl 3FFT 3TRF ^TcT^R fgitfl paragraph tag ^FF color green 

define =b<ci gl Ffr color body tag gr color override 4^ Jll I afR 341444 paragraph 
green text # show gRrn ^H44 ftRJT 3TF TfT gl 3FFT execute TOF 4FT £rsT 

gl 

chtml > 

<head> 

<title> myPage </title> 

</head> 

< body sty le= ,p color : red” > 

Learn html in Hindi <br> 

Lean html in Hindi in 2 days. <br> 

Learn html in Hindi pdf. 

<p Style= T, color : green" > 

This is some text here 
</p> 

</body > 

</html> 
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3TT # 3TPT -H'hd ^ paragraph TT text color 3 TpRT ^ define i^-m zrar ^1 

ir body % text color override +J.HI §"1 HTML attributes 3J3T TT? guide line 

?Wr ffl Rld+l follow 3TTT attributes TT SFT <jTI ?ass # sft^r fc^JT 3TT 

Guidelines for using HTML attributes 

© g^T3IT attributes ^Ff lower case # define ^tl 
© g^TSIT attributes values quotation mark # define ^Ftl 

Common HTML attributes 

5ilM4>l HTML # commonly ^T3f gW ^TrT attributes list 3?T T^f §“1 


Attribute 

Explanation 

Example 

id 

HTML document # tag uniquely identify 

fiTl id attribute 3J3F 3TTRT 2 

tags id same gf TT^cfT |t| 

<P 

id= ,, mypara M > 

class 

attributes tags 3 TfRT JTFRT class # 

categories ^ fotTT 3J3T f^TT oiirii §1 «rgci ^ 

tags 17^ class ^ gf TT^rT §1 

<hl 

c las s= TI java " 

> 

title 

tag ^TT tittle ^ ^ 'f^tTT title 

attribute 3J3T oiirii t?l 

<P 

title=" Hello 

"> 

style 

attribute c^Hi 3TTT tag “FT style rules 

apply ^FI sH^rl I"! 

<P 

style= T, color 

: red"> 
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HTML text formatting and styles 

O Introduction to HTML text formatting in Hindi 

Q Types of HTML text formatting in Hindi 
D Styling HTML text in Hindi 


Introduction to HTML text formatting 

HTML # JTJ tags text formatting ^ f^xr provide ^Tir |i tags WT ^FTc^ 

grr 3TFT web page TT text presentation position control TT |l 3TFT 

text bold HT underline ^FT t\ Pftfr text editor #T 3TTT t i t«f button click 

sH^d §" HTML # ^h4i f?Hr 3TFT tags 3J3T TT sH^ I'll TTJ common formatting type |" 

3ft 3TFT text TT apply ^RcT |" 34J4il list sfr^r £t 3TF |l 

Q Bold 
Q Italic 
Q Underline 
Q Marked 
Q Superscript 
Q Subscript 
O Small 
Q Deleted 


HTML <b> tag 

HTML % 2piRT Ph+fl text ^St bold *b<dl foTTT <b> tag ^3T 3TTrTT I'll fS y 3TPT 
starting 3ttr ending tags beech # text fS^Jcl I" I 


<b> This text will be bolded. </b> 


HTML <i> tag 

HTML tff^Eft text ^t italic <i> tag ^J3T f^IT 3TTHT t\ 


<i> This text will be italic. </i> 


HTML <ins> tag 

text underline < ins> tag ^J3T ftrm 3nrTT I"! 


< ins> This text will be unde r 1 i n ed < / in s > 
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HTML <mark> tag 

TrfSr 3TTT text highlight =M<HI ^TT^cT S Ht 3m^r f^nr <mark> tag 3J3T ^FT mF^T I"! 


HTML <sup> tag 

text ^Ft super script ^FT^T f^nj 3TPT <sup> tag ^J3T TR Si 


<p> This is normal text<sup:> This will be super scripted </sup> This is 
normal again </p> 


HTML <sub> tag 

3T3TT 3TTT text 3# subscript # Hldl S' rfT 3 TT^T f^PT 3TFT < sub > tag ^J3T *+4j1 I 


<p> This is normal text <sub> This text will be subscripted </subx/p> 


HTML <smaU> tag 

3 TTT text ^Ft text # tSteT TST^TT TTT^r S' Hf f^rir 3 TFT <small> tag 

miFcT §ri ^F^ editors dm text ^Ft highlight <=&<A Sr f^nr str ^FTct Si 


<p> normal Text <small> Smal Text </small> </p> 


HTML <del > tag 

tag Tt deleted 3Tt f^TCT 3TFT <del> tag m fT^rm^T =FT mF^T |tl 3m f^T tag 

deleted show S' Ht 3^1 text through line show SWr |TI 


<p> <del> This text will be deleted</delx/p> 


^mFT imr complete 3dMeUU| sft^T f^TTT 3fT TfT S"l 


<html > 

< head> 

<title>Text Formatting</title> 
</head > 

<body> 


<p> 


^H4*l complete 44.J£4UI 3fT Ts=n" g-| 


<html> 

<head> 

< title >Text Formatt ing< /title > 

</head > 

< body> 

<p> 

<b> This text will be bolded. </b> 

</p> 

<p> 

<i> This text will be italic. </i> 

</p> 

<P> 

< ins > This text will be underlined*: /ins> 

</p> 

<mark> This text will be highlighted </mark> 

<p> This is normal text<sup> This will be super scripted </sup> This is 
normal again </p> 

<p> This is normal text <sub> This text will be subscripted </subx/p> 

<p> Mortnal Text < small > Smal Text </ small > </p> 

<p> <del> This text will be delet edc/delx /p> 

</body > 


</html> 
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Styling HTML text 

Text Tit style % f^nr 4?T 3RTTT color change TT font family change TTOT arrlSf 

f?lk J CSS TjT f^UT 3TTHT §"| CSS UTT TeIT topic §"1 BTIFT «l l<t H<i TTT^ - §1 TT 

3TT=r^r f^rc ttj styles tt 4di<m 3 tf jjh f^rcr arrqr style tag 3j3r 

TRct |tl 3ttT UTT CSS property 3ttr 3TT^t values cRt ft! 

Changing text color 

ft^ft afr tag ^ text TT color change TR^t f^Ttr am CSS ^t color property TRcT gd 3ttr 
colon <T3TTTvT color TT srrar ftcT fTI 


<p s t y 1 e = " co lo r : re d T1 > T h a s text will be red. < / p > 


Changing font family 

Text font family change TR^T #r f^HT aTTT font family property 3j^r TRx^ |C 3tfR value % 
font family TT snar |n 

<p styles” font --family : Aria 1 ” > This text will be in Arial </p> 

Changing text size 

Text size change TR^T foTC 3 TFT font size property 2J3T ff jftT value #r WT # 3 fr 
Size 3 TTT RT^rT ^ 


<p style="f ont-size : 45" > This size is changed by style tag. </p> 


Changing text position 

Text position change TR^" ^ f?ftr text align property ^J3T 3TTcft 1 ? 3ttT value #7 ^=T ^T 
3TFT left, right W center pass TR |tl 


<p style= "text - a lign=" center " > Th is position is change by style tag</p> 


$-h*i Jcii$4ui f^rr sir £i 


< html > 

<head> 

<title>Text Forrnatting</tit3Le> 

</head> 

< body> 

<p style=" color: red" > This text will be red, </p> 

<p style="font -family : Arial" > This text will be in Arial </p> 

<p style="font-size : 45" > This size is changed by style tag. </p> 

<p sty le= "text -align : center" > 

This position is changed by style tag. 

</p> 

</body > 

</html> 


16 


HTML finks f o+ * ® * t in ^ 

Q Introduction to HTML links in Hindi 
Qi Creating links with HTML in Hindi 
Qi Configuring links with HTML in Hindi 
Q Image links with HTML in Hindi 


Introduction to HTML links 

xrt link ftTTT text W image iftftf ft fSfFT qr click +Tft ftr 3TTT page FT redirect +T Iftxr 3TTft 
ftl 3R aft 3TFT r^4fl link FT 3FFTT cursor ft 3nft ft Hf ^ IFF clickable hand icon ft convert ift 
3TTHT ftl Links FT basically RF page ft ^Tft page FT 3nft ftr fftxr feur 3TTHT ftl Links 

web roads iftftf ftl 

HTML ft link create FRft ftr fftr <a> tag spr fftnrT 3TTTTT ftl fft anchor tag s^fT FF3T 3TTcTr ftl 
^TT tag ftr 3Rft basic attributes href 3ftr target fttft ftl pt sftftf attributes ftr Fft ft fttft 
sidi^ii ^pjr ftl 


href 

^TT attribute ftr d^UI 3TTF 3TT - page FT address define FRft ft 3ft 3TTF - link click ?tft FT 
show +4dl ftl 


href = "page -Address” 


target 

target - RT attribute ftr d^KI 3TTT frame define FRft ft ftftr FT 3T?T page ift «Mdl -dl^cl ftl 
ft attribute optional fttHT §"1 Ffft 3TTT ?ft define 3fftt ft Ht page new tab ft open fttHT ftl 
^TT attribute % FRJ predefined values ftfftf Iftu 3TTF use FR - TTFTt ftl 


target = "frame -Name" 

Q _blank - 3R 3T?T ft value define FRft ft eft 3114+1 webpage new tab W window 
ft open fttHT ftl 

Q _self - 3R" 3TTF ft value define FRft ft Hf 3TTFFT webpage 3Tff tab FT frame ft 
open fttHT ft fSTTTft link FT click ftvtil ^TTT «jti 
D_ parent - ft value webpage Fft parent frame ft open 4R<-fl ftl 
Q top - ^ST value ft" <yKI web page full document ft open iftHT ftl 
Q customFrame - 3TTF WET FT aft Fftf frame define +T TFFft ftl ftw FRft FTT 
webpage 3ftT ft open ftfrTTI 


Creating links in HTML 

3TFR?r -MHI-y I HTML #t c[3HT link create % fpHT 3TTT <a> tag aj*T ^RcT ?tl 
3%r tt #r 3(14+1 ij3r *Mcl ft at aHT^r aTc4T 3 TT?ir tag normal structure 5t3rT |tl 
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<a href="address-of -webpage> link-Name </a> 


HTML # links create complete ic^l^uui sft^T f^RTT 3TT TFT |T| 


<htrnl> 

<head> 

< title >Text Formatting</titIe> 

</head> 

<body> 

<p> 

Go to Google <a href ="www. google - com" >C lick H ere</a> 

</p> 

<p> 

Go to Best Hindi Tutorials <a href= "www . besthinditutorials * com" >Click 
Here< /a> 

</p> 

<p> 

Go to Facebook <a href="www, facebook, com">Click Here</a> 

</p> 

</body > 

</html> 


Configuring links 

Links 3TTT 3TT^T page according configure air ^FT TT^FrT ^ I 3TFT apply ^FT TFF^I fr 

air ^Ftf link TT mouse <1 3fr^t rft 3TT^T color green Ft 3TT# 3ttr mouse F^TtT red Ft 
3TT^n *T TRT 3TFT style tag ^ S^RT TR TT^rT £i 3TTT a *F TTRT condition colon FRTRFT 

define ^Rcf fTl ^rt 3t sfr^t f^RTT 3fT TFf S’! ^TTT 3F7FTW 3TFT CSS tutorials # ^ TFT^T 

tl 
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Configuring links 

Links 3TT 3TTT page according configure aft ^FT g"! 3TP=T apply ^FT FRFT^ ft 

aft ^Fl^ link TT mouse 3TT# Ht 3TT3T color green 3TT# 3ttT mouse £dlcl f?T red ^ 
3TT^ri # 3TFT style tag ^FT ^T^rT £-| f^rcr 3TTT a ^tht condition colon FRTFFT 

define ^FTcT ftl ^tT £T f^TT" 3TT g"! £<H4d ddj^uui 3TFT CSS tutorials *T ^ 

8-1 


Condition 

Explanation 

a : link 

^TT condition Jf link first time web page Tf show ^lcii §1 

a: visited 

condition # link 'hi6<h visit 3TT ^tcfT ftl 

a: hover 

condition # mouse RT cursor 3TRTT 3TTHT ftl 

a : active 

3R - 3TTT link TT click RTcT ft Ht link active ^TcfT §1 


HTML tables 

Qi Introduction to HTML tables in Hindi 

Q Creating HTML tables in Hindi 
Qi <tr> HTML table row tag in Hindi 
Q <td> tag HTML table column tag in Hindi 
Q <th> tag for heading in HTML tables 
Qi Styling HTML tables in Hindi 


Introduction to HTML tables 

RblTl aft data ^Ft structured form # represent ^ f?T3t 3TFT tables use *Mrl §1 3T^ 
webpage # tables include *fo<*b aFPT 3ftr 3# structured aflT attractive ^RFcT §"1 
HTML A tables create 3TPT <table> tag ^pr ftl tag sub tag ftHT 

ft <tr> table row tag ftl <tr> tag 3T 3fT i^F sub tag fftHT ft f^T# <td> 
table data tag 4>£cl ftl 

Creating tables in HTML 

^Ftf" sfT table row afTT columns ^ Jti <table> tag sTraf row create 

^ fm 3TFT < tr> tag zpr ftl 3TFT QdtfTl rows create ^TTT ^TT^rT ft 3H^t ft <tr> tag 
define ftl Rows create ^ ^Tct JPPT rows # columns create ftl Columns 
create f^T <td> tag ^FT ^R^TiTT f^rur did! ftl 3TTT columns create <=Mdl 'dl^ 

I" JdH fft <td> tags define *Mcl ftl 
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S-H+l JdJ^UI 3TT £l 


<html> 

<head> 

<±itle> Table web page < /title > 

</head > 

<body> 

<table border =" 1” > 

<tr > 

<td>First row first columns /td> 

<td> First row second coioumn< /td > 

</f r > 

<tr > 

<td>Second row first columns /td> 

<td>Second row second column</td> 

</t r> 

</table > 

</body > 

</html> 

Table create fiSriT 3HIM-H1 tags TT order *liRw I TRTfr <table> 

tag 3TIHT £l WIF <tr> tag 3TTHT Fl fTR <th> 3#T <td> tags 3iT^T £l <th> 

3il < <td > tags ^jh^TT <tr> tags 3TFR" ^ 3flfif^Tl 

TTTT eii ri 3nH«bl 3-fl< ^TTf^TT =Pl 3T3" d^H 3 iih border attribute S^RT table 4>i border 

define ^FRcT F ftt table border show Fl 

Creating table headings 

aTPT Bt tables first row 3^ headings stf create TR sH^fcI I - ! Heading text table 
text 3Ttr wr f^TTT §1 3FFT table create ^ft t|T 3 ft employees ftF 

information store 3RefT ft Rf 3TFT Names 3fR addresses 3TTfi^ headings create R^cl ftl 

Heading create f^T <th> tag dldl t\ ^ table heading tag §"1 ^TT 

tag # 3TPT 3fr text spr ^RcT |T RF webpage heading FRF show ^TcfT §1 fR" tag <tr> 
tag 3TRT 3pr f^RTT 3TTHF |T| fR^FT 3c^T 5fT^ f^RTT 3TT TfT §1 
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< ht rnl > 

< head > 

<‘tit:le>Table Heading Page< /title > 

</head> 

<body> 

<table border="l”> 

<-t r > 

<-th> Names</th> 

<t h >Addresse< /th> 

</t r > 

<tr> 

<td >RairK/td> 

<td >Ayodhya< /t d > 

</tr> 

<tr> 

<td >Krishn</td > 

<td >Vrindavan</td > 

</t r > 

</table> 

</body > 

</html> 

COLSPAN attribute 

3TTT w|T TT=F row % column # ^TTFTT columns # sfr divide £l 

3TFT 3^T column # colspan attribute define |fl column # 3fTT 

colspan define £ wT column 3H^T columns fil 3FJeFHJT fcpzjT 

3TT Tfn- tl 
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< htrnl > 

<head> 

<i:itle>Colspan WebPage </tit!e> 
</head > 

< body > 


<~table border^" 1" > 

<tr > 

cth >Natnes </th > 

<th colspan ="2">Mobile No . < /th> 

</tr> 

<tr> 

<td>Ram</td> 

<-td>4856456465486</1:d> 

<td >1235713</td> 

</tr> 

<-tr> 

<-td >Sihyam</td > 

<td colspan ="2" >12683124598</td> 

</tr> 

</table> 

</body > 

</html> 

3FT tht apt THT pass 2 mobile numbers §1 ^f^<H ^^TT3T pass 

mobile number ffl zrflr ajpr normally table create HT ^Tcft row # F^F column 
3T7Tf STET 3TTWfn ^ # table aft 3TE^r FT^t d^jfll 3TFT ?11T cTTcft 

row ^FT F^ column 3^TT row Eft columns ^Ff cover ^Ft eft 3TFT 3FT column # colspan 
attribute ^J3T 3#T columns SIFT IFF column cover *Mdl xj I £<rl |t 3HJ1 |ft 

integer values £cT |tl 4ft 3FT iFT example yxtm ^Tcft row ftr f^f column ^ TW 
c«ichii row ^T2 columns cover ftl 

ROWS PAN attribute 

ROWSPAN attribute aft colspan 4ft FR?T £r ^THT |TI 3TPT <tr> tag £r define =FT?T £l fTT 
attribute 3TFT values F^ row 3FT^T j£t columns 3RTF ftTrfT §"l 

35J^TFT sftft f^TT 3TT TeF ftl 
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< html> 

< head > 

<title> Rows pan Webpage </titie> 

</head > 

<body > 

<table border = "l" > 

<t r> 

<th rowspan=”2" >Mens</th> 

<td>Ram</td> 

</tr> 

<tr> 

<td >Shyam</td > 

</tr> 

<tr> 

cth rowspan="2" >Womens</th> 

<td>Sita</td> 

</t r> 

ctr > 

<~td >Gita</td > 

</t n> 

</table> 

</html> 

Naming the table 

3TFT wtJ' Hf table ^FT stttt S' caption alt ?fl f?PT 3TFT < caption > tag 

^FTcT t\ ¥& <table> tag Sr ^ define fS^TT 3TTHT ffl ^H*hl fS^T ^TOT Si 


< html> 

<head> 

<title>Naming "the tables</title> 
</head > 

< body> 

< "table border="2 ,l > 

<caption> MyTable< /caption > 

<± r> 

<1:d> Vipin Sharma</td> 

<1td > India < /td > 

</tr> 

</table> 

</body> 

</html> 
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HTML images f o* * « ^ t in a* 

Q Introduction to HTML and images in Hindi 

Q Including images in your web page in Hindi 
O Attributes used with </mg> tag in Hindi 
Q Example 


Introduction to HTML and images 

Images # web page attractive 3tR beautiful cHIdl §"l HTML web page # 3TTT 

^-■14 image add TT Jrl'hrl §1 f^rrr 3TFT <img> tag 3T3T <+><<r\ ftl <img> tag 

attributes provide «h4HI ft nhch-h aTFT image representation ^Ft control TFT Stl 

attributes Wit # flr^Tr 3T TFT ?l 


Attributes 

Explanation 

src 

fTT attribute #7 c^dUl 3ft image 3TPT show TTdT *JIFc* ft 3TT^FT 

URL ^TT 3TTHT ft I 

alt 

?TT attribute value text FtrfT ft 1 ’tiTi a TT 3TPT 

image web page TT show <r\£\ ^tcfT Ht 3TT^T 3RTF" text show 

FtHF ftl TT^F HTF ^T ^T image TTT alternative FtHT §"l 

width 

^FT attribute ^F c^aKi 3TFT image ^T width set TTTcT ftl 

height 

^TT attribute 3TPT image #TT height set TTTrT §"| 

style 

?TT attribute ^ciki afFT images TT CSS rules apply ^FT 

TT^T ftl 


Including images in web page 

^THT 3TT cidl'Ml f^T?T aft web page #r images include amr < img > tag TT 

FTcTiTRT ^FTH ftl < img > tag ^ TTT3T src attribute 3j3T =m<HI necessary FTrTT ftl ®llf^ TrafT 
attributes optional Ft^T g - ! 33frFT°T f^TT 3TT TFT ftl 


<htrnl> 

<head> 

<title>Web page with image< /t it ie> 
</head> 

<body> 

< img src=’ , image-url"> 

</body > 

</html> 
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Setting alternative text with images 

image show 5=f|t £ Hf alternative text 3TT 3RF^r qr show ^tHT |i 3r 

attribute search engines ^JT eldlA ^ f?ttr afr ^J3T ft»±ii ^TTHF image # |T| 

3^T^T cr r cfP^ 3TT J"] 


<htrnl > 

<head > 

<t it le> Image with alternative text </tit le > 

</head> 

<body> 

<img src="image- url" alt= ,n Photo of vipin shartina ,f > 

</body > 

</html> 


Setting height and width of images 

Height afrr width set f?PT 3TF T height 3ftT width attributes 3J3T =Md §"1 $<h4m values 

3TTq integers # |tl 


<ht«nl> 

<head> 

<title>Image with alternative text</title> 
</head> 

<body> 

<img src="image-tirl" height ="200” widths " 200 " > 

</body > 

</html> 


Setting border of images 

3TFT image border aft set ft f$HT JTFT border attribute *Mcl |T| 

attribute value border size ^Lcft ?TI 
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<html> 

<head> 

<title> Image with alternative text</title> 
</head> 

< :body> 

< img s rc=" image -url" border= r ' 5" > 

</body > 

</html> 


Making image a Link 

3TFT WT|r at- image link sfr 55TT TT^rT t>w 3T*r sfr image HT click 4>}ail eft 

TJ^F aror web page open fft^TTI flTtt f^nr STT'T <img> tag ^t" <a> tag at f?RsFt |tl Anchor 
tag at text =Pr 3RTF 3TTT <img> tag define sr^T £1 $<H+I 3 ^TRnr afrtt f^TT srr fjTl 


<html> 

<head> 

<title>Image with alternative text</title> 
</head> 

<body> 

<a href="www* bestlh inditutorials .com" > 

<irng src="image-url"></a> 

</body> 

</html> 
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HTML lists f g* * © * t in * 

Q Introduction to HTML lists in Hindi 

Q Types of HTML list in Hindi 
Q Ordered list 
Q Unordered list 
Q Definition list 
Q Creating HTML lists in Hindi 

DType attribute with ordered HTML list in Hindi 


Introduction to HTML lists 

HTML # STTT sit information lists ^ d^\W\ sit represent TT 4H4icl §"1 Lists c^dKi 
3JTT webpage =FT well ordered TOT gd HTML 3TP=r 3 FRfT ^t list TOT §3 
# Sfr^t hi -4 1 3TT T^T 


Type 

Explanation 

Example 



G A 


it list ordered form £f ^lcii $"1 ^TT ^T 

Q B 


list 3TTT order TT 

G c 

Ordered - List 

^t numbers (lj 2 , 3 5 ) 3ttT 

G D 


alphabet s(a_, b, c^d^e^f) rRF 

G E 


list STFT <ol> tag ^ c^hi create «h<rl 5?l 




Q a 


^FT rRF list unordered form it ^tclt |T| 

Q b 

Unordered- List 

rRF list items bullets it 

Qi c 


represent ^i\r\ |T| HIF list 3TTT 

Q d 


<ul> tag ^ create |h 



Definition list # F|^T 3TFT list item 

A 


define TOct ^ 3ltT TOT 3TT^T definition 

First 

Def in it ion -List 

provide TOl |T| fT HIF list 3TFT <dl> 

Alphabet, 


tag create TTrT §1 List item 



declare TOtt" ^ fcTIT <dt> tag 3ttT 

B 


definition T Tchu <dd> tag f^TZTT 

Second 


3TTHF |T| 

Alphabet 


Ordered list 


ofTTT 3H I H4 t1 h^ch sldl'MI ordered list create f^U 3TM <ol> tag 3=T ^J3T ^RrT 8"l ^FT 

tag 8^ 3"Tc^ list item define ^ f^nr 3fFT <ll> tag ^J3T ^fTcT 8l ^rft tag unordered list # 

3ff 3J3T f^HT 3TTHT 8*1 f^T^T 5^ f^TT 3TF T^T |tl 


<html> 

<head> 

<title>Grdered list </title> 

</head > 

<body > 

<ol> 

<li>Rami</li> 

<li>Shyam</li > 

<li>Sita</li > 

< li>Gita</li> 

</ol> 

</body > 

</html> 

Type attribute 

Ordered list ^TRT atFT type attribute aft 3J3T ^rr TT^F^ - 8l Type attribute % d^NI 3TFT # 

8" 3TT=T list HTF # order -Mdl 8l 3TFT numbers #t list -U l ^ 8" 

Ht 3TTT type attribute value 1 define 8"l 3ttr 3TFT alphabet order list 

8" cfT type attribute value a 8" I 3JTT eft roman letters aft list ^FT define TRFcT 

8' J?d4i f^PT 3FFT type attribute =£t value I 8"l ^^l ^T^UJT f^TT 3TT T^Y 8l 
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Unordered list 

Unordered list fsbUd <=b<<A Sr 3TFT <ul> tag ^FT ^F^3=rrcT <4R^ Si ^FT tag % <li> tag ^ 
list item define f^=rir 3TT^T Si ^FT FR^T list 3^ type attribute 3 values 3TT S' I 

Disc, Circle 3ftT square values 3TFT 3H I 3TcT3T FRIT unordered list create ^R ■JH'hd Si 
Jdd^UI 3TRt f^AJI JRIT S"l 


<html > 

<head > 

<title> Unordered list < /"title > 
</head > 

cbody > 

<ul type= "square" > 

<11 >Ram< / 11 > 

<11 >Shyam< /li > 

< / u 1 > 

</body > 

</html> 


Definition list 

Definition lists #r <^dKi 3=nn=r f^RfT term definition provide ^IR^ |T| Definition lists create 
%■ f^TU 3TFT <dl>, <dt> 3#T <dd> tags ^4-cU-IIH ^fR^T Si ^FPFT 3^TF^ j T str^T TS^I RRT Si 


<html > 

<head > 

<t it le >Def in ition list: </t it le > 
</head> 

<body> 

<d± > 

<dt >A< /dt > 

<dd>First letter of a Iphabet < /dd > 
<dt >B</dt > 

<dd>Second letter of a Iphabet < /dd > 
</dl > 

</body > 

< / htrnl > 
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HTML frames f o* * © ^ t in * 

Q Introduction to HTML frames in Hindi 

D Creating HTML frames in Hindi 
Q < frameset > tag in Hindi 
Q Example 


Introduction to HTML frames 

webpage ^rt ^F^ sections it divide ftoil 3TT 4H*Fdl S'! sections 3TFT frames aft 
sH^ri Jtl ir sections tRF <£JRt st independent fl section webpage Ti 

represent £l arrFTTFf it Ht tt^F webpage ^Ft sections if divide 3^=T 

sections if ^Frt' webpages 3ft show WT 444 ^ jtl FRfT U47 webpage ^ 3RfT 4^ 
webpages show fM 3TT 41+^ |tl JJlft *TT section if 3T^RT webpage load f^rnr 3fT d^dl 

ti 


T^nhI tRF frame it 3TFT header create |T 3ttT f=^\Hl frame it menus create 

3TT d^Hdl |fl $ir ft wr webpage footer ddim 3TT d4>dl f" 3?tT ^Rt - webpage 4ft main 
window ^t HIF 3J3T f^FZTT 3TT ^*hdl |T| 

Frames 4ft ^raft web browsers support ^rft ^FTct f"l 3ttr frames 4Tif webpage 4?t cell 

4T it problems 3TT 4H4>cfl |tl Frames ^t ir 3f*m 31cW computers *TT webpage 
3Tom ara^i ir f^i| $ht £1 Frames 4^ft 4^=r ^3T 3n?rr gi 3rsr aiiM+l ^rft it 
ft r^T ft frames =FT 4^tl 


Creating HTML frames 

3W 3TTT frames 4ft ^J3T sFTct £ Ht <body> tag s=rft T^>aji dldl f"! f^F?fr afr webpage it 

frames define f?|TT <frameset> tag 3j3T ^iidl ffl ?TT tag 3 ft rows 3ttr cols 2 

attributes ft^" ft" I f^T attributes values °/o if <Sr dlcft §1 TF4T webpage 4ft 100% OTir 
eft f5ld*fl value 3TPT frame 3cT^ft ft 3RT|T cover 4Rdl f I 

Rows attributes ^ 3TFT webpage 4ft rows it divide |t| 3ttr cols attributes ir 
webpage it columns create f^rit 3FrT fl 


chtrnl > 

< frameset rows= ,, 10 J 90 n > 

< frame src= ,, htmll . html" > 
< frame src="html2 . html" > 
</f rameset > 


</html > 
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^rqr t ^it example if TW page 3 frames if divide R>FI FFT jjfl <frame> tag ^ d^UI 
individual frames ^Ft configure R-^l didl 8" I <frame> tag src attribute E^FKT 31R 
webpage URL define <=b<r\ | Hbt<HI44 1 frame #^T show f^tFT FF3FT" frame ^F order FT 

depend *Mdl It'll Rhft webpages URL 3fPT £ir Ft automatically 3^T frames if load ^t 
3TT^f?n 

STTF frame ^ T^h+Tl action c^hk frame if iif target «b< *H*bd §1 ^J^TF" f^RT 
TRF frame if link FT click 3TTF - frame iT webpage open |tl 


Attributes 

<frameset> tag attributes f£tcT f F3T 4d4* 3TTT TTTt - frames Fft configure FR - 

trf^t |n 

Q cols - 3TF T columns FT frameset create FRFT -^i^d g'if attribute ^ 

c^iUI define f^mr 3TTHT |TI ^TTF - F^fT columns ^f size aft define ^f 3TRft |TI 
Q rows - 3TFT ft>d*?l rows # frameset F^t divide «M<HI -Ul^cl g"iT ^F attribute 
c^ui define Rfft 3TTHT |TI 3ftr 3d -Pi size tft 3TT=r attribute if £t define FRir ffi 
Q frameborder - WZT attribute ^ dy Kl if define T^b^ll dldl !> ^Pf 3fT=r frames ^Ff 
border show FRdl WT^cT FT s^l fTT attributes yes 3#T no 2 values fit 
TTFRft m 

Q fra mess pacing - ^TT attribute ^F Ul frames ^F ^TF if space define ft>FI dldl 
§■1 


<frame> tag % TITF sir FR£ attributes provide fit g" use «k 4» 3TTT |R" frame F# 
separately configure FR TTFF^T §"| 

Q src - ^FT attribute % d^kl frame ^ f^PT webpage FF address define Rfett dldl 

fcl 

Q noresize - ^F attribute if 3fPF define «+Rrl £ frame F^f resize Rfft 3TT dF>dl f 
FT d^fl 

Q scrolling - fFT attribute define f^FT ^fldl ^f frame Ffr scroll FR §" FT 
H^tl 

Q name - ?TT attribute ^ 3TTT frame F^T F^tj" dRT §"1 


<html> 

< frame set rows="90 J 10"> 

<frame src="htmll . html" noresize=”yes T ' scrolling="no" > 
<frame src="htnil2 . html" noresize="yes T ' scrolling= T, no" > 

< /frame set > 

</html > 
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T a rgeti ng f r a me s 

TT3T frame frame target WR& ^ T 3TFT links # target attribute use 

|tl 3ttr 3TT attribute value 47^ t JTFT fSw frame # 3TT link open «Mdl -^i^d ft 3TT 

frame ^FT 5=mr ^rT §1 ^sh4i f^nr ’ c T|r£r 3llH«bl < frame sro tag # frame ^TTIT 

define *Mdl ^HT ?tl f?HT BfFT name attribute ^RcT ftl 


<html> 


< frameset rows= M 90j 10" > 


< frame src='"htmll . html" 

r ame= " my Frame " > 

< frame src="htrril2 . html" 

narae= " yr Frame" > 

</f rameset> 


</html> 



<html> 

<body> 

<a href="www< google .com" target =" my Frame" >myLink</a> 
<a href="www. google .com" target=' F yrF ratine" >yirlLink< /a > 
</body > 

</html> 
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HTML blocks f g* * © * t in a 

Q Introduction to HTML blocks in Hindi 

□ HTM L Div tag in Hindi 

□ HTML span tag in Hindi 


Introduction to HTML blocks 

HTML # block level 3ftr inline 2 RF ^ tags ^ ftl 3R sfT block level tags webpage # 
show §" Ht automatically q^ 3ffT SfTFT # XRT line TT space ?flHT §"1 3T5 common 
block level tags Fit # fltur 3TT t?t §ri 

□ div 

□ p 

□ hi 


d’Jl'h «K tags inline tags ^ |fl 3HT if tags 3J3T f^tr 31^ |t Ht webpage # SR^T TF^T 
3j3T 3HT tag # line # f\ show Ft ^TTrT $1 ^ 3TFT <br /> tag 5TT Fit rfr 

3iir FTF at space FlfT FtHT etl inline tags fSfir 3TT §"1 

□ span 

□ anchor 

□ img 

HTML <Div> tag 

<div> tag page Ft divide F^T tr f^Ttr 3RT f^nrr 3TTHT ftl division tag aft FF^ jjfl f^r tag 
fl’anr^r HTML tags Ft JRT FT qF^T In <div> UF block level tag ftl RT tag Ft CSS tr 
TTTJJ 3j3T FTcT gtr 3TTq 3R^T webpage Ft design FT -W+ci $1 page qt page Ft section # 
divide FT £ht fTI 

fa - sections Ft 3TR 3TRH q?^F FT hide 3ttr show FT dFcl £l tqr FT^f qr information 
webpage q? itt aft visitor Ft TF show F^ft FF FF ^.Wdl dljUll I <div> R apply Rff 
CSS <div> 3TcfT t> TTafr tags FT apply ^Idl ?"l 


Ph'Hl webpage 3TFPT 3TRT HTF information Ft separate FT^T ftPT <div> tag Ft 

fern 3fT ttfht t\ rift 3fwt ftR stt tft t\ 


<html> 


<head> 

<title>Div tag demo </title> 

</head> 

<body> 

<div sty le="color : black ; background -color : green; padding : 10px; margin : 20px; M > 

This is a cool website you can learn all programming languages here in 
Hindi language. 


</div> 

<div sty le=" color : black; background -color: red; padding : 10px; ">■ 

This is another div. What i am trying to tell you is that these two div's 
are different. And will act differently, 

</div> 


</html> 
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Some other block level tags 


Tags 

Explanation 

<form> 

<form> tag block level tag ^fFT ?TT tag ^ JfFT 

webpage RT form ^Ft beginning 3}tl end define 

HTML forms ^ related tags tag 3TTcT I"! 

<hl>, . , . *<h6> 

WfT heading tags block level tags |tl gl heading 

Ttt block define *h<r\\ f^RT^T T T£pt' 3tt? # automatic line 

break ^THT |"l 

<p> 

^TTT 3TT=r <p> tag paragraph define f^IT 3TTHT £ 

3frT ?T paragraph ^F 3ft? ^ # line break ftHT 5?I 

<p> tag 3fr block level tag TTRT ^RTF $1 

<ol> , <ul> 

sftcFTl" list tags <ol> or <ul> block level tags ^"1 

list 3TT TR F section define *h^dl §"1 

<table> 

<table> tag §fT TT3F block level tag JTRT ^TTHT ^ ^ T7^> 

3T?RT section create =Mdl §"1 3ft page % ^ content ^ 3fcT^T jftHT 
I - ! 3tt? 3?^ 3ft? #f line break include =Mdi £"1 

<pre> 

# block level tag ftHT |T| ^T# TTSfT tags 3J3T f^T 3FT 

<H*bd |T| 3ltT ^J3T ^ JTTT text editor # tags ^?T 

configure ^ ^ j£t ^ webpage show ftHT ftl 


HTML <span> tag 


<span> inline tag “.-h+h 3TFT text format 3TW sfT STPT fF tag Ff FjT ?f Hf 

fFir 3TT^RvT text S^FTfr line if FT 3TTFT 3Tff line if TjtHT Jl 3Tf text fF tag ^ 4fF TgfTT £ 
formatting 3F 3tff FT apply ?Wr ffl <span> tag ^ Ftf’ attributes Fijff ftcT irfea 

stft style 3frr class attributes ^ff fa tag % ft*t ft FFcT |fi fa tag fT ana headings if 
sfr 3i3r ft FFir fjri fTiFi 35 jtfftt ifftr fctar ft Titr ?fi 
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<html> 

<body> 

<p> 

This is a paragraph. In this paragraph if you wart to apply formatting to 
certain words then you can <span style="color : red; "> put them in span fag, 
</span> 

</p> 

</body > 

</html> 


Some other inline tags 


Tags 

Explanation 

<a> 

<a> fag 3^f inline fag TTTRT 3TTHT jfl 3J3T 3^TcT 3TFT 3fT 

text 3ft link TOT %\ 3fT webpage # 3^fT line # 

show ?tHT §"1 

<b> 

<b> tag f^RT line break 3ft text 3ft bold 3RHT %\ 

it aft TR> inline tag ^tHT 5£l 

<i> 

<i> tag text 3ft italic 3RTHT %\ 3ttT it aft IF37 inline tag ^trTT %\ 

<u> 

<u> fag 3fPT text 3^t underline 3^T^ |t| ?3f 3# inline tag <hhi 

3TTHT t\ 

<irng> 

<img> tag JfFT T^\Hl text line # image insert 3Tf R3xf 

iffl ftRT text # 3fl^ line break R^t 3TTRT |t| ^rf&IT <img> 

tag aft XF3> inline tag iftHT 

<input> 

< input > tag 3TFT form arefT elements create <=Md §* 

4ft text-box 3tt? button 3fT3 <br /> tag 3J3T RT 

3^T Fft ?dT elements 3^ line break R^f ^TtrTT |t| 


37 


HTML forms f g* * © v t in a 

□ Introduction to HTML forms in Hindi 

□ <form > tag in HTML forms in Hindi 
Q <input> tag in HTML forms in Hindi 

□ Attributes of form tag in Hindi 

Introduction to HTML forms 

afr webpage RT HPT 3" information -^i^d 3 Ht f&tr HPT forms 
^4-rlJ-IIH 3l d^il^uui 3r f^pT 3R aft HP T =*33 <FRfT email id create 4Rcl 3" c3 4H«l3 H£<?1 sign 
up form 3TT3 - 3" I ^TTT HPT HF^fT information webpage c^ki provide =tucl 3l Forms 
^TT 3 1 input FR3r FF TR3r common dlW>l 3fHT 3l ^ form H3TT FT input 3rHT 3 
^TjTT 3TT form submit *Mdl 3 cfr 3 1 TTffT information ftRft database 3" store FR <?T 
^ildl 3l User 3" information input FRFPf 3r f^PT HPT ^3 y«bU form elements 3j3T FR TPRf 
3l ^3r text-box, radio button, drop-down list Hlf^l 

Rh3l sit webpage 3" forms create 4R3 f?HT HPT <form> tag 3j3T ^r 3 3l 3 container 
tag 3fHT 3^t ^ ^ form beginning 3fhT ending define *Mdi 3l fTT tag 3r 3RT 3RRT 
3TFRT form elements define HTcT 3l <form> tag attributes 3 3T3 f^HT RT 

3i 


Attribute 

Explanation 

action 

attribute 3" HPT define <4Rcl 3 ^3 form submit 3^ HT 
^< 0-31 3 1 33 ^3 3J3R 3r form submit FRcT 3" HPT ^33 

webpage 3 thank you message 3TT FR 3 ^ ^3 php 

script execute 3RFT TRT3 3l 

method 

attribute 3" HPT data ^3 store FR3 FT" method define 

«t><rl ft"l ^FT attribute 4o=ich 2 values GET TIT POST gt +i=hcfl 

£l 

target 

?Tr3 HPT form submission 3r RTcF 3t window show 3^3 

define FRcT 3l 


Form elements HPT <input> tag 3r define 4Rcl 3i tag 3r FFJ attributes 3t3 3 ^3 
HPT elements configure FR3 f3rrr tj^t ^TrT 3l FTt: 3 3r3 Rmr 3TT TFT 3l 
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Attribute 

Explanation 

name 

^3T attribute particular form element 4T BT3T define f^TT 

3TTHT BOT server value store ^ fcHT 

3vJHT |TI 

type 

# element type show |t| 3fT BBT -UcHdi ft 

cR?" value input 3TT W text -boxes f?P7 type 

text ^tcTT §"1 

size 

^ 3TTT ftrfT form element size width # define ^rl ffl 

SFFT text -box 3TB^" according width £ |t| 

value 

# fSpfft element default value gl <H*M) |TI StfT 3TN f^ffr 

text box % 3T3T first name feRsTT g3TT £o<rl 5^1 


3TT^T 3FT ^ tags 3frr attributes 3j3T 4 gT 3TPT U4T complete form 

create |T| 


Creating text boxes 

HTML # forms ^ f^PT text-boxes 4^dl 3"gH fT easy |TI f^PT 3TTT <input> tag #r 

type attribute # text value define 4^ |TI atr default value ^ f^TT 3fr text-box ^ 
3TZTT show fWr 3PHT value attribute ^J3T Jt| 3TFT password input TT^T f^rxr 

text-box TOT 7|T §" Hf type password c^TT ^TTI 3^J?TW str^T f^TT 3TT <?l 


< htirnl > 

< head> 

<title>Text box demo</title> 

</head > 

< body> 

<form> 

Enter your email : < input type="text” value=" Email ... name= , 'email r ' size=" 
20 " > < brxbr > 

Enter your password r<input type= "password” value= " Password " name= ,, pass" 
size=” 20" > 

</form> 

</body > 

</html> 


Creating buttons 

HTML # 3TFT 4 FR|T buttons f^Ud ?tl 3TFT type attribute c^KI define 

sttT # sfrtr f^rrr g-i 
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Q Submit - # button form submit <*><A #7 f^nrr dIHI |tl # button rT form 

#7 TTSfr elements values IFF TTTCT server RT send FT c^HT |h 3fT=T type 
attribute # submit value define FH" HTF FT button f^Ud FT d*hcl |tl 

Q Reset - ^TT button form ^7 fields values Ft reset FI*} fctu 3J3T ftnrr 

oHldl ffl Reset button create Flat #7 t"Su 3fT=r type attribute Tt reset value 
define <=fr<A |TI 

Q Normal button - T7F normal button fTFTT §" Rid RT click FtcT 3TFT sfT 
action ^ dFct ?tl FH" FRF button QbUd Fl^ f^FT 3TTR type attribute 3 f value 
button £fT fTI 

Q Image button - FRF button # 3TTR button #7 background # image 2c 
HFrl §1 FH FRF *fT button create Fl*t #7 f^rj 3TTT type attribute value image 
ttr $\ 

<html > 

<head> 

otitle > Button desno< /title> 

</head > 

<body> 

<form> 

<input type=" submit " > 

<input type=”reset " > 

<input type=" button " value= "Click here" > 

< in put type=’' image " value= " image- file- path -here" > 

</form> 

</body > 

</html> 

Creating radio buttons 

Radio buttons % d^FIll ^jftt fScdi keyboard #7 webpage Ft information provide Fldl S’! 
Radio button box ft HT ft Rrfr choose Fi4> user 3TRrft choice «Mldl ftl nflt 

3TTR user ^7 gender ^7 # dlddl ft Fit 37FT 2 radio buttons create FR#7 ddi ftttf 

male 3ttT female $ TTFcT |T| 3J3R fFttf Ftf aft choose FT^F 3RdT gender FHT TTFFTT 3TTF 

2 w 2 3TftRF radio buttons Ft name attribute ^7 d^lll connect ft dlT^ user IFF 

TT3TF RT froi RFT fft radio button select TT^7I Rw radio b uttons Ft 3TTR - atHW # connect 
Fldl dlfct 3Ff#r 3TTT name same ^ ftl 


Radio button ft^Ud Flat #7 f^TF 3TTR <input> tag ^7 type attribute ^t value radio 5? I 
Name attribute # radio button FT fftt f^RTT dldl fTI #HT ^t 3RT FFFTTT 3TTR Radio 
buttons FT group eidldl dlfct ft dlf^ user i?F FT # UF fit radio button select FT TT#7 
Fit drft situation # arrr Tntr radio buttons Ft uf ft ftttt £cT |rt fTTFT 3FTFRT fcFTT 3TT TfF 

tl 
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<html> 

<head> 

<title> Radio Button Demo </title> 

</head> 

<body> 

<form> 

Select you Gender: <br> 

<input type= ,, radio , ‘ name= M gender"> Male 
< input type=" radio" name= "gender" > Female 
</form> 

</body> 

</html> 

Creating drop down list 

Drop down list create f^PT 3TFT <select> tag ^FTcT |"| tag form tag 

^ 3T^T define ftrzrr 3TTHT ffl if tag drop down list structure ft l'd ^RcTT £1 Drop down 
list values define ^ f$P7 <option> tag define ft ill 3fTRT *tl JTFT list item 

add «Mdl ^l^cl ft 3rf^ <option> tag define ftl <option> tag <select> tag # 
define ft^T 3TFHT jtl |tl 
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< htrnl > 

<head> 

<title>Drop down list demo </tit!e> 

</head> 

<body> 

<form> 

<select > 

<option>SGlect</option > 

< opt ion v alue= " Ma le ” >Mal e< / option > 

< opt ion value="Female">Female</option> 

</select> 

</form> 

</body> 

</html> 

Creating check boxes 

Check boxes stT user multiple options choose facility ^TTTtT |T| 

3TTT -dl^rl f user multiple courses choose eft 3TTT check boxes create 
H*hrl 3ttr user select §"1 

Check boxes ISkUd 4vWI ¥gcT 3TOW ^tHT |tl foTC 3TFT <input> tag ^ type attribute 
H check box value 3ft? Name attribute #T check-box ^FT RTH ^ |fl Value attribute 
value sfr 3fFT £ f^n trtt $i 


<html > 

<head > 

<title>Check box demo </title> 
</head > 


< body > 


<form> 

< in put type=" checkbox” 
< in put type=" checkbox” 
<input type=" checkbox” 
< in put type=” check box" 
</forin> 


name= r, MCA” > MCA 
name=" BTECH " > Btech 
name=" BCA” > BCA 
name="BCA™ >M . tech 


</body > 

</html> 
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HTML font tag f g* * @ » t in a 

D Introduction to HTML font tag in Hindi 

D Attributes of HTML font tag in Hindi 
□ Examples of HTML font tag in Hindi 
D Commenting in HTML in Hindi 


Introduction to HTML font tag 

website 47 fonts 37f configure ^r 47 3TFT 3^" 3#r sit attractive, readable 3#T 
structured TRFcT £l By default 3 H I*h 4?1 website font family 3# FT TTFcft oiftrd 
3TFT 3TO% website 47 ^ configure 37^47 font family sit ^J3T 371 |fl 

jSft 3TFT font color atT change 37T ?tl 

Fonts ^4 configure 47 fcttT HTML <font> tag provide =mhI |fl FTT tag 37t 3TPT i^dl 
paragraph TT sit apply TR ft 3#T 3TFF Wl|r cit Phtfl paragraph # particular text R alt 
apply tor 3fT ^HT £l <font> tag T7T HTML 5 ft include dft tor *mr ^1 HTML 5 # 

css tt Trfnr tor tuftt 

<font> tag 47 3 attributes *44 |tl 

□ size - RT attribute 4" 3TTT font 4 tT size change TR T737cT §1 Font size 
numbers # ^t 3nrft |TI 

D face - fR attribute Sf^RT font family change 44 3TT4t §"1 3TTR 3Tt font family 
^TTgrT 4 3lt inverted commas # define TRcT jti 

D color - 4 attribute font WJ 37RT change TR4" 47 ^jsr ftor 3TTHT ftl 3TTT color 
TT hex code d+4 |t ur ftR color RW sit £ RTTcf jti 


Setting font size 

Font 44 size 3TFF size attribute 4 define TRrT *tl Fd4>l ddj^ui 4t4 f^T 3TT TFT £l 


<html> 

<head> 

<title>Font size demo </title> 

</head> 

<body> 

cfont size^'lO" > HTML in Hindi</font> 
</body > 


</html> 


Setting font family 

Font family set sRst fpltr 3TFT face attribute 3jpr sr 3 ftl ?*^FT 3SJRUT sfr^T Ht^tT 3TT T^T 


43 


<html> 

<head> 

<title>font family demo</f itle> 

</head> 

<body> 

<font face= ,p Verdaina T, > Learn HTML In Hindi</font> 

</body> 

</html> 

Setting font color 

Font SFT color 3TFT color attribute ^ change ?TI idU^UUI sft^r fc^TT Jrar |“I 


<head> 

<title>font color demo </title> 

</head> 

<body> 

<font color =" red ">HTML tutorial in Hind i< /font > 

</body> 

</html> 

Commenting in HTML 

^ ^TT ifrw FfrTT t ^ developer d^UI fpRtfT gf script developers alt ^J3T ^TrT §*| 

script explain «M<HI necessary 3TTHT |T HTi^ ^FTt developers 31144?! script 
^p- problems 5TT ?tl 

Script ^Ft explain 3TF T comments ^Ff sjp £1 HTML # comments 

define 3il4lld |tl Comments interpret t ^T| HTML interpreter comments 

^Ff skip ^FT 3TTHT I"! 2 rrf?T comments # g3TT rit text 3fFrtr webpage BT afT 3RR 
sicHdi ftl 3R^t script rS^lsIcl TO comment U^F ^|cT professional habit §1 


HTML # comments alt tags ^ d^<H\ ftrft 3^ £l HTML 3TRT5t U^F unique tag 

provide =Mdl £l 
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<!-- your comment here --> 


f^FT JdJeUUj SfRT f^TT 3IT TfT |ti 


<html> 

<head> 

< tit le> commenting demo</tit!e> 
</head> 

<body> 


<p> Hello </p> <!-- 

</body > 

A paragraph --> 

</html> 
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HTML <embed> tag f g* # @ f t in a 

Q Introduction to HTML <embed> tag in Hindi 

Q HTML < embed > tag attributes in Hindi 
D Using HTML < embed > tag in Hindi 
DHTML <noembed> tag in Hindi 
DHTML <audio> tag in Hindi 
DHTML <video> tag in Hindi 

Introduction to HTML <embed> tag 

3TFT 3TT^T webpage # multimedia file add I -dl^cl audio, video W 

flash Jrrf^ Ht HTML 3tlH«h1 < embed > tag provide TRTft £i fF tag grr 

3TFT 3T=r^r webpage *f 3TFFT^ft 3ft multimedia file add £ll 

<embed> tag webpage ^ panel create ^RHT fSPH# 3fFT^r multimedia file 

show ijrftft t\ 3TTT < embed > tag 3J3T TRT^r §"?ft controls browsers automatically 
panel # provide *Mdl It"! sfif zrfSr STTTft' video add ftvUI §" eft f^TC play, pause 
3TTf§T controls browser d^lKI automatically provide 3TTrT §"1 

HTML 5 # ^THT^T media file ftr f^HJ tTF ara^T tag aft provide JUir §1 3ft 
<audio>, <video> 3TTfSci 

fir tags ftrinft # anft «mwi di^Jii i ftPhd Tjrft anfft ftTsrftr £ #T < embed > ftr 
# attributes 3J3T 3TF ^1 

HTML <embed> tag attributes 

HTML < embed > tag ftr TTra 4 essential attributes srirT f I f^ftr 3t sftft 3TT 


Attributes 

Description 

src 

fTT attribute ft? ikii JTFT 3TT file 3T address £rT 

3TT webpage # include ^i^ri 5^1 

height 

fH attribute e^= iki create fftrft ^TTT panel 3ft height define 
3n^r g-i 

width 

# attribute create farff 3TTT panel width define <=Mdl 

tl 

type 

fTT attribute ^ 3TFT include Tftt file TH" type define 

TT gl 


PT attributes 3idWI global 3ttr event attributes sfr <embed> tag 5TT*T aj?T ftrtr 


t\ 


Using HTML <embed> tag 

<embed> tag uw; 341^1 £■ trarfT &i 
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<html> 

< head> 

<tit le> embed tag example </t it Ie> 

</head> 

<body> 

<hl>My favorite song</hl> 

<embed src=' 1 /media/ video/my File" height= T, 300" width="300" > 
</body > 

</html> 


3*TT f^r r JJTT 3^W £r <embed> tag ^ ^ video file Tft webpage # add f^TT ttzit fil 

9TT video file height 3ttT width 300 fFrfTI 


HTML <noembed> tag 

T'str browsers < embed > tag ^Ff support 3=r^t ^RcT f| browsers % f&TT 3TFT 
<noembed> tag 3j3T TR §"1 pr tag cembed > tag #r 3ip fTRT 3TTHT f I 


ftRff browser # <embed> tag support aft 3R 79T ft Bf pr tag <yui 3ir=r pr media 
file 3Ri^ PF browser # image show BR f I an^T TTT idj^ui $ RRp^T 3FF 
^RTTF^Tfl 


<html> 

<head> 

<title>no embed tag example </title> 
</head> 


<body> 


<embed src= ,B /media/videos/myFile" height^"' 
cnoerribed src- M /media/ images /my File" > 
</embed> 

lp widths" "> 

</body > 


</html> 



3RT f^xr RU 3ppw # browser <embed > tag support Rff 3RBF f rft 3TT^t 3Rlf 


<noembed> tag # define ^nfT image show fr^fTI 


HTML <audio> tag 

Audio tag ^ £^RT 3TTR ftRfr sfT webpage # audio files mp3 add 3R R*hcl f I 

inline tag fiBT f I 3TFT 9# f^Rfr text line £r add 3R - ftl 9R tag common 

properties f^RF RF T?F f I 


47 


Attributes 

Description 

src 

ipTfT attribute c^HT STPT audio file address define 

t\ 

autoplay 

FT attribute ^ 3TTT audio file load fftcT % 

automatically play ^ set ^*hcl |T|| 

controls 

# attribute «ididi $ audio file ^ controls 

show gW| 

loop 

FT attribute S^RT define f^TTT 3TTHT $ audio file 

repeat Ffafr zir FT attribute true 3#T false 2 

values ftcff §"1 

muted 

FT attribute #T 2^RT # define f^nTT 3TTHT |T audio file 

3RT load ^fT Ht ^F mute Ffafll 

preload 

# attribute define <=Mdi |t audio file 3ftT load 

-diQiii i 


<audio> tag 3c;i£<ui c^tKi j i-mi §"1 


<html > 

<head> 

<title>audio tag example< /title> 

</head > 

<body> 

< h 1 > My -Favorite song </hl> 

< audio co ntrols=” controls "> 

(source src = "media /Audio/ example . mp3” > 
</audio> 

</body > 

</html > 


HTML <vfdeo> tag 

HTML <video> tag Kl 3fFT sir webpage # video file add |TI tag 

7TT5T attributes 3J3T 3it < audio> tag ^TRT fn tag 

3C, i^^ui Sj^TTT ^PT^TRTT ^RTT §"| 


<html> 

<head> 

<title>video tag example< /title> 
</head> 

< body> 

< video controls="controls"> 

(source src= "media/ video/ example * mp4” > 
</video> 

</body > 

</html> 
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